Ext.regModel('Board', {
	fields : [ {
		name : 'serial',
		type : 'int'
	}, {
		name : 'subject',
		type : 'string'
	}, {
		name : 'content',
		type : 'string'
	}, {
		name : 'writer',
		type : 'string'
	}, {
		name : 'writtenDate',
		type : 'string'
	} ]
});

// 4. 데이터 접근.
function boardData() {
	// 데이터 읽기.
	var record = boardStore.getAt(0);
	console.log(record);
	console.log(record.data.id);
	console.log(record.data.firstName);
	console.log(record.data["lastName"]);
}

var boardStoreListener = {
	add : function() {
		console.log("add");
	},
	beforeload : function() {
		console.log("beforeload");
	},
	datachanged : function() {
		console.log("datachanged");
	},
	exception : function() {
		console.log("exception");
	},
	load : function() {
		console.log("load");
	},
	remove : function() {
		console.log("remove___");
	},
	update : function() {
		console.log("loadexception");
	}
}

var boardProxy = new Ext.data.AjaxProxy({
	url : '../searchJsonBoard.do',
	type : 'ajax',
	model : 'Board',
	reader : {
		type : 'json',
		root : 'result'
	}
});
// 3. Store생성.
var boardStore = new Ext.data.JsonStore({
	model : 'Board',
	encode : 'true',
	proxy : boardProxy
});
boardStore.sort('serial', 'DESC');
boardStore.load();


var boardList = new Ext.List({
	fullscreen : true,
	store : boardStore,
	styleHtmlContent: true,
	itemTpl : '<div class="board_service"><strong>serial</strong> : {serial}<br/><strong>subject</strong> : {subject}<br/>'
		+'<strong>writer</strong> : {writer}<br/><strong>written date</strong> : {writtenDate}</div>',
	listeners : {
		itemtap : function(dv, ix, item, e) {
			var rec = boardStore.getAt(ix);
			var pop = this.popup;
			var popupPanel = new Ext.Panel({
			    floating: true,
			    store : boardStore,
			    centered: true,
			    width: Ext.is.Phone ? 400 : 1000,
			    height:Ext.is.Phone ? 500 : 600,
			    styleHtmlContent: true,
			    html: '<div class="mail_content"><strong>subject</strong> : ' + rec.data.subject + '<br/> <strong>writer</strong> : ' + rec.data.writer +  
			    '<br/> <strong>written date</strong> : ' + rec.data.writtenDate + '<br/> <strong>content</strong> <br/>' + rec.data.content,
			    dockedItems: [{
			    	xtype: 'toolbar',
			    	dock: 'top',
			        title: 'Board Content'
			    }, {
			    	xtype: 'button',
			    	text: 'close',
			    	handler: function() {
			    		popupPanel.hide();
			    	}
			    }],
			    scroll: 'vertical'
			});
			if (!this.popup) {
                this.popup = popupPanel;
            }
            this.popup.show('pop');
		}
	},
});
